<template>
  <view class="studentList commonDiv">
    <view class="top">
      <!-- <view class="search-top">
        <view class="inner">
          <view class="inner-box">
            姓名：
            <u--input
              placeholder="请输入姓名"
              v-model="searchForm.name"
            ></u--input>
          </view>
        </view>
        <view class="inner">
          <view class="inner-box">
           <u-button  text="清空" style="width: 100px;margin: 0 10px;"  @click="clearHandle"></u-button>
            <u-button type="primary" text="搜索" style="width: 100px;margin: 0 0 0 10px;" @click="searchHandle"></u-button>
          </view>
        </view>
      </view> -->
      <view style="margin-top: 4px;display:flex;">
        <u--input
          style="border: 1px solid #e5e5e5;background: #fff; flex: 1;"
          placeholder="医生姓名"
          prefixIconStyle="font-size: 22px;color: #909399"
          :clearable="true"
          v-model="doctorName"
        >
        </u--input>
        <u-button type="primary" text="检索" style="width: 60px;margin-left: 10px" @click="getList"></u-button>
      </view>
    </view>
    <view class="bot">
      <drag-button
        :isDock="true"
        :existTabBar="true"
         v-if="page.total > 0"
        @btnClick="btnClick"/>
      <ua-table
        :columns="column"
        :data="data"
        :stripe="true"
        :border="true"
        :headerBold="true"
        headerBgColor="#f3f6f9"
        headerColor="#333"
        height="calc(100vh - 140px)"
        style="border:1px solid #eee"
         v-if="page.total > 0"
      >
      </ua-table>
      <view class="page-box"  v-if="page.total > 0">
        <page-pagination style="display: flex;" v-if="page.total > 0" class="test-pagination" :numAround="true" :total="page.total" layout="page,prev,next,limit,total"
          :pageSizes="[20,50,100,500]" :pageSize="page.limit" @sizeChange="sizeChange" @change="pageChange" color="#09f">
        </page-pagination>
      </view>
      <view v-if="page.total === 0" class="noData">
          <view class="icon iconfont icon-zanwushuju1"></view>
          暂无数据
        </view>
    </view>
  </view>
</template>
<script>
import mRequest from '@/api/index.js'
import hccmStore from '@/common/hccm-store.js'
import avatar from 'uview-ui/libs/config/props/avatar'
import dragButton from "@/components/drag-button/drag-button.vue";
import { writeFile } from 'xlsx';
import moment from "moment";

export default{
  data(){
    return{
      flag: '',
      doctorName: '',
      title: '本日销量',
      roleId: '',
      searchForm: {
        name: ''
      },
      page:{
        limit: 20,
        page: 1,
        total: 0
      },
      column:[
        { type:'index', align: 'center', fixed:false,width:100 },
        { prop: 'kdrq', label: '建档时间', align: 'center', fixed:false, width:220,},
        { prop: 'hospName', label: '医院', align: 'center', width: 410},
        { prop: 'drugName', label: '品名', width:360, align: 'center'},
        { prop: 'spec', label: '规格', width:410, align: 'center'},
        { prop: 'amount', label: '数量', width:140, align: 'center'},
        { prop: 'doctorName', label: '医生姓名', width:160, align: 'center'},
        { prop: 'patientName', label: '患者姓名', width:160, align: 'center'},
        { prop: 'mobile', label: '手机号', width:199, align: 'center'},
      ],
      data:[]   
    }
  },
  components: {
    dragButton
  },
  methods:{
    btnClick(){
      let params = {
        // firstDay: '2024-09-02',
        // lastDay: '2024-09-02',
        roleId: this.roleId,
        page: '1000000',
        size: '1',
      }
      if(this.flag === 'thisDayAmount'){
        // 当天
        params.firstDay = moment(new Date()).format('YYYY-MM-DD')
        params.lastDay = moment(new Date()).format('YYYY-MM-DD')
      } else if (this.flag === 'thisMountAmount'){
        params.firstDay = moment().startOf('month').format('YYYY-MM-DD')
        params.lastDay = moment().endOf('month').format('YYYY-MM-DD')
      }else{
        params.firstDay = moment().subtract(1, 'months').startOf('month').format('YYYY-MM-DD')
        params.lastDay = moment().subtract(1, 'months').endOf('month').format('YYYY-MM-DD')
      }
      
      this.$axios({
        url: 'http://47.93.103.74:8080/sales/export', // 你要请求的URL
        methods: 'get',
        responseType: 'blob',
        params: params,
      }).then(res=> {
        var binaryData = []
        console.log(res.data)
        binaryData.push(res.data)
        let blob = new Blob(binaryData, {
          type: 'application/vnd.ms-excel'
        })
        setTimeout(() => {
          if (window.navigator.msSaveOrOpenBlob) {
            navigator.msSaveBlob(blob, 'link')
          } else {
            const link = document.createElement('a')
            console.log(window.URL.createObjectURL)
            let newTitle = ''
            if(this.flag === 'thisDayAmount'){
              newTitle = `${this.title}(${moment(new Date()).format('YYYY-MM-DD')}).xlsx`
            }else if(this.flag === 'thisMountAmount'){
              newTitle = `${this.title}(${moment().startOf('month').format('YYYY-MM-DD').substring(0,7)}).xlsx`
            }else{
              newTitle = `${this.title}(${moment().subtract(1, 'months').startOf('month').format('YYYY-MM-DD').substring(0,7)}).xlsx`
            }
            link.download = newTitle
            link.style.display = 'none'
            link.href = window.URL.createObjectURL(blob)
            document.body.appendChild(link)
            link.click()
            URL.revokeObjectURL(link.href)
            document.body.removeChild(link)
          }
        })
      })
    },
    getList(){
      if(this.flag === 'thisDayAmount'){
        // 跳转到本日销量
        let params = {
          // firstDay: moment(new Date()).format('YYYY-MM-DD'),
          // lastDay: moment(new Date()).format('YYYY-MM-DD'),
          roleId: this.roleId,
          doctorName: this.doctorName,
          page: this.page.page,
          size:this.page.limit,
        }
        mRequest.salesThisDaySales(params).then(res=>{
          this.data = res.page.data
          this.page.total = res.page.total
        })
      }else if(this.flag === 'thisMountAmount'){
        // 跳转到本月销量
        console.log(34343)
        let params = {
          roleId: this.roleId,
          doctorName: this.doctorName,
          page: this.page.page,
          size:this.page.limit,
        }
        mRequest.salesThisMountSales(params).then(res=>{
          this.data = res.page.data
          this.page.total = res.page.total
        })
      }else if (this.flag === 'lastMountAmount'){
        // 跳转到本月销量
        console.log(34343)
        let params = {
          roleId: this.roleId,
          doctorName: this.doctorName,
          page: this.page.page,
          size:this.page.limit,
        }
        mRequest.salesLastMountSales(params).then(res=>{
          this.data = res.page.data
          this.page.total = res.page.total
        })
      }
    },
    sizeChange(val){
      this.page.limit = val
      this.page.page = 1
      this.data = []
      this.getList()
    },
    pageChange(val){
      this.page.page = val
      this.data = []
      this.getList()
    },
    searchHandle(){
      this.page.page = 1
      this.data = []
      this.getList()
    },
    clearHandle(){
      this.page.page = 1
      this.searchForm = {}
      this.data = []
      this.getList()
    },
    pullUpLoadingAction(){
      if(this.page.total <= this.page.limit * this.page.page){
	      return
	    }else{
        this.page.page ++ 
        this.getList()
      }
    },
  },
  onLoad(options){
    this.flag = options.flag
    this.roleId = options.roleId
    this.title = options.flag === 'thisDayAmount' ? '当日销量': options.flag === 'thisMountAmount' ? '当月销量': options.flag === 'lastMountAmount' ? '上月销量': ''
    uni.setNavigationBarTitle({
      title: this.title
    });
    this.getList()
  },
  onPullDownRefresh() {
    this.getList()
    setTimeout(() => {
      uni.stopPullDownRefresh();
    }, 1000);
  },
}
</script>
<style lang='scss'>
/deep/.ua__table .ua__table-tbody .ua__tbody-td{
  height: auto !important;
  overflow: auto !important;
  word-break: break-all !important;
}
.studentList{
  display: flex;
  height: calc(100vh - 1px);
  flex-direction: column;
  padding: 10px 20px 30px;
  box-sizing: border-box;
  .top{
    height: auto;
    width: 100%;
    .search-top{
      font-size: 14px;
      // overflow-x: auto;
      flex-wrap: wrap;
      display: flex;
      .inner{
        flex: 0 0 200px; /* 确保每个子元素有固定宽度 */
        display: inline-block;
        padding-right: 20px;
        padding-bottom: 10px;
        .inner-box{
          display: flex;
          justify-content: center;
          align-items: center;
        }
      }
    }
    .search-bot{
      display: flex;
      justify-content: flex-end;
      align-items: center;
    }
  }
  .bot{
    flex: 1;
    // height: calc(100vh - 100px);
    overflow: auto;
    display: flex;
    flex-direction: column;
    .page-box{
      height: 50px;
      width: 100%;
      display: flex;
      align-items: flex-end;
    }
  }
  /deep/.ua__thead-th{
    font-size: 16px !important;
    height: 40px;
    line-height: 40px;
  }
  /deep/.ua__tbody-td{
    font-size: 14px !important;
    height: 34px;
    line-height: 34px;
  }
  /deep/.ua__table .ua__table-thead{
    z-index: 11 !important;
  }
}
.noData{
  height: 150px;
  width: 100%;
  background: #f5f5f5;
  color: #999;
  border-radius: 8px;
  // border: 1px solid #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  margin-top: 10px;
  .icon{
    font-size: 60px;
    margin-bottom: 10px;
  }
}
</style>